<style lang="less" scoped>
.panel {
  margin-bottom: 10px;
  &-title {
    display: flex;
    padding: 10px;
    border-bottom: 0.1px solid #eaeaea;
    background: white;

    &__label {
      flex: 1;
      font-size: 16px;
      align-items: center;
    }
  }
  &-content {
    margin-bottom: 10px;
    background: white;

    &__item {
      display: flex;
      padding: 10px 10px 0 10px;
      font-size: 14px;
      &-label {
        color: #666;
      }
      &-value {
        flex: 1;
        padding-left: 15px;
        color: #333;
      }
    }
  }
}
.main-pic {
  width: 400px;
  height: 200px;
}
</style>

<template>
  <div class="panel">

    <!-- content -->
    <div class="panel-content">
      <div class="panel-content__item">
        <div class="panel-content__item-label">公告类型</div>
        <div class="panel-content__item-value">{{item.Category||'-'}}</div>
        <div class="panel-content__item-right"></div>
      </div>
      <div class="panel-content__item">
        <div class="panel-content__item-label">刊登日期</div>
        <div class="panel-content__item-value">{{item.PublishDate||'-'}}</div>
        <div class="panel-content__item-right"></div>
      </div>
      <div class="panel-content__item">
        <div class="panel-content__item-label">刊登版面</div>
        <div class="panel-content__item-value">{{item.PublishPage||'-'}}</div>
        <div class="panel-content__item-right"></div>
      </div>
      <div class="panel-content__item">
        <div class="panel-content__item-label">上传日期</div>
        <div class="panel-content__item-value">{{item.SubmitDate||'-'}}</div>
        <div class="panel-content__item-right"></div>
      </div>
      <div class="panel-content__item">
        <div class="panel-content__item-label">当事人</div>
        <div class="panel-content__item-value">{{item.Party||'-'}}</div>
        <div class="panel-content__item-right"></div>
      </div>
    </div>
    <!-- content -->
    <div class="panel-content">
      <div class="panel-content__item">
        <div class="panel-content__item-label">内容</div>
        <div class="panel-content__item-value">{{item.Content||'-'}}</div>
        <div class="panel-content__item-right"></div>
      </div>
    </div>
    <!-- content -->
    <div class="panel-content">
      <div class="panel-content__item">
        <div class="panel-content__item-label">公告人</div>
        <div class="panel-content__item-value">{{item.Court||'-'}}</div>
        <div class="panel-content__item-right"></div>
      </div>
    </div>

  </div>
</template>
<script>
export default {
  data() {
    return {
      item: {}
    };
  },
  onShow() {
    this.getInfos();
  },
  methods: {
    getInfos() {
      const item = this.$route.query.item;
      this.item = JSON.parse(item);
    }
  }
};
</script>
